var stats = new Stats();
var c = document.getElementById('c'),
    ctx = c.getContext('2d'),
    img = document.getElementById('curImg');
var pxPerS = 50,
    offSet = 0;

img.onload = function() {
    c.width = this.width;
    c.height = this.height;
    ctx.drawImage(this, 0, 0);

    (function loop() {
        ctx.fillStyle = '#ddd';
        ctx.fillRect(0, 0, c.width, c.height);
        requestAnimationFrame(loop);
        var fps = stats.update();
        drawBackground(fps);
    }());
}

function drawBackground(fps) {
    if(!fps && (fps = 60));
    var v = pxPerS / fps;
    offSet += v;
    //重复场景
    if(offSet >= c.width) {
        offSet = 0;
    }
    ctx.save();
    ctx.translate(-offSet, 0); //偏移绘制
    ctx.drawImage(img, 0, 0);
    ctx.drawImage(img, img.width, 0);
    ctx.restore();
}